// 测试视频下载助手 - 弹窗脚本

class PopupManager {
  constructor() {
    this.serverUrl = 'http://localhost:8080'
    this.init()
  }

  async init() {
    await this.loadSettings()
    this.bindEvents()
    this.checkStatus()
    this.checkVideoInfo()
  }

  // 加载设置
  async loadSettings() {
    const result = await chrome.storage.sync.get(['serverUrl'])
    if (result.serverUrl) {
      this.serverUrl = result.serverUrl
      document.getElementById('serverUrl').value = result.serverUrl
    }
  }

  // 绑定事件
  bindEvents() {
    // 下载按钮
    document.getElementById('downloadBtn').addEventListener('click', () => {
      this.downloadCurrentVideo()
    })

    // 批量下载按钮
    document.getElementById('batchDownloadBtn').addEventListener('click', () => {
      this.batchDownload()
    })

    // 打开管理界面按钮
    document.getElementById('openManagerBtn').addEventListener('click', () => {
      chrome.tabs.create({ url: `${this.serverUrl.replace(':8080', ':3000')}` })
    })

    // 保存设置按钮
    document.getElementById('saveSettingsBtn').addEventListener('click', () => {
      this.saveSettings()
    })

    // 帮助链接
    document.getElementById('helpLink').addEventListener('click', (e) => {
      e.preventDefault()
      this.showHelp()
    })

    // 关于链接
    document.getElementById('aboutLink').addEventListener('click', (e) => {
      e.preventDefault()
      this.showAbout()
    })
  }

  // 检查状态
  async checkStatus() {
    try {
      // 检查登录状态
      const [tab] = await chrome.tabs.query({ active: true, currentWindow: true })
      const loginStatus = await this.checkLoginStatus(tab)
      this.updateLoginStatus(loginStatus)

      // 检查服务状态
      const serviceStatus = await this.checkServiceStatus()
      this.updateServiceStatus(serviceStatus)

    } catch (error) {
      console.error('检查状态失败:', error)
      this.updateLoginStatus(false)
      this.updateServiceStatus(false)
    }
  }

  // 检查登录状态
  async checkLoginStatus(tab) {
    if (!tab.url.includes('test.com')) {
      return false
    }

    try {
      const results = await chrome.scripting.executeScript({
        target: { tabId: tab.id },
        function: () => {
          // 检查是否存在登录相关的元素
          const loginElements = document.querySelectorAll('[class*="login"], [class*="user"]')
          const userInfo = document.querySelector('.user-info, .username, .avatar')
          return userInfo !== null
        }
      })
      return results[0]?.result || false
    } catch (error) {
      console.error('检查登录状态失败:', error)
      return false
    }
  }

  // 检查服务状态
  async checkServiceStatus() {
    try {
      const response = await fetch(`${this.serverUrl}/api/health`, {
        method: 'GET',
        timeout: 5000
      })
      return response.ok
    } catch (error) {
      console.error('检查服务状态失败:', error)
      return false
    }
  }

  // 更新登录状态显示
  updateLoginStatus(isLoggedIn) {
    const statusElement = document.getElementById('loginStatus')
    if (isLoggedIn) {
      statusElement.textContent = '已登录'
      statusElement.className = 'status online'
    } else {
      statusElement.textContent = '未登录'
      statusElement.className = 'status offline'
    }
  }

  // 更新服务状态显示
  updateServiceStatus(isOnline) {
    const statusElement = document.getElementById('serviceStatus')
    const downloadBtn = document.getElementById('downloadBtn')
    const batchBtn = document.getElementById('batchDownloadBtn')

    if (isOnline) {
      statusElement.textContent = '在线'
      statusElement.className = 'status online'
      downloadBtn.disabled = false
      batchBtn.disabled = false
    } else {
      statusElement.textContent = '离线'
      statusElement.className = 'status offline'
      downloadBtn.disabled = true
      batchBtn.disabled = true
    }
  }

  // 检查视频信息
  async checkVideoInfo() {
    try {
      const [tab] = await chrome.tabs.query({ active: true, currentWindow: true })
      
      if (!tab.url.includes('test.com')) {
        return
      }

      const results = await chrome.scripting.executeScript({
        target: { tabId: tab.id },
        function: () => {
          // 提取视频信息
          const title = document.querySelector('h1, .video-title, .title')?.textContent?.trim()
          const course = document.querySelector('.course-name, .breadcrumb')?.textContent?.trim()
          const section = document.querySelector('.section-name, .chapter')?.textContent?.trim()
          
          return {
            title: title || '未知标题',
            course: course || '未知课程',
            section: section || '未知章节'
          }
        }
      })

      const videoInfo = results[0]?.result
      if (videoInfo && videoInfo.title !== '未知标题') {
        this.showVideoInfo(videoInfo)
      }
    } catch (error) {
      console.error('获取视频信息失败:', error)
    }
  }

  // 显示视频信息
  showVideoInfo(info) {
    document.getElementById('videoTitle').textContent = info.title
    document.getElementById('courseName').textContent = info.course
    document.getElementById('sectionName').textContent = info.section
    document.getElementById('videoInfo').style.display = 'block'
  }

  // 下载当前视频
  async downloadCurrentVideo() {
    try {
      const [tab] = await chrome.tabs.query({ active: true, currentWindow: true })
      
      // 发送消息给content script
      await chrome.tabs.sendMessage(tab.id, {
        action: 'downloadVideo',
        serverUrl: this.serverUrl
      })

      this.showMessage('下载任务已创建', 'success')
    } catch (error) {
      console.error('下载失败:', error)
      this.showMessage('下载失败: ' + error.message, 'error')
    }
  }

  // 批量下载
  async batchDownload() {
    try {
      const [tab] = await chrome.tabs.query({ active: true, currentWindow: true })
      
      // 发送消息给content script
      await chrome.tabs.sendMessage(tab.id, {
        action: 'batchDownload',
        serverUrl: this.serverUrl
      })

      this.showMessage('批量下载任务已创建', 'success')
    } catch (error) {
      console.error('批量下载失败:', error)
      this.showMessage('批量下载失败: ' + error.message, 'error')
    }
  }

  // 保存设置
  async saveSettings() {
    const serverUrl = document.getElementById('serverUrl').value.trim()
    
    if (!serverUrl) {
      this.showMessage('请输入服务器地址', 'error')
      return
    }

    try {
      await chrome.storage.sync.set({ serverUrl })
      this.serverUrl = serverUrl
      this.showMessage('设置已保存', 'success')
      
      // 重新检查服务状态
      setTimeout(() => this.checkStatus(), 1000)
    } catch (error) {
      console.error('保存设置失败:', error)
      this.showMessage('保存失败: ' + error.message, 'error')
    }
  }

  // 显示帮助
  showHelp() {
    const helpText = `
使用说明：
1. 确保后端服务正常运行
2. 在测试平台登录账号
3. 打开视频页面
4. 点击下载按钮即可

注意事项：
- 请遵守平台使用条款
- 仅供个人学习使用
- 请勿用于商业用途
    `
    alert(helpText)
  }

  // 显示关于
  showAbout() {
    const aboutText = `
测试视频下载助手 v1.0.0

功能特性：
- 一键下载视频
- 批量下载支持
- 进度实时监控
- 文件管理

技术支持：
- 基于Chrome Extension API
- 微服务架构后端
- React前端界面

开发者：CodeBuddy
    `
    alert(aboutText)
  }

  // 显示消息
  showMessage(message, type = 'info') {
    // 创建消息提示
    const messageDiv = document.createElement('div')
    messageDiv.className = `message message-${type}`
    messageDiv.textContent = message
    messageDiv.style.cssText = `
      position: fixed;
      top: 10px;
      right: 10px;
      padding: 8px 12px;
      border-radius: 4px;
      font-size: 12px;
      z-index: 9999;
      ${type === 'success' ? 'background: #f6ffed; color: #52c41a; border: 1px solid #b7eb8f;' : ''}
      ${type === 'error' ? 'background: #fff2f0; color: #ff4d4f; border: 1px solid #ffccc7;' : ''}
      ${type === 'info' ? 'background: #e6f7ff; color: #1890ff; border: 1px solid #91d5ff;' : ''}
    `
    
    document.body.appendChild(messageDiv)
    
    // 3秒后自动移除
    setTimeout(() => {
      if (messageDiv.parentNode) {
        messageDiv.parentNode.removeChild(messageDiv)
      }
    }, 3000)
  }
}

// 初始化
document.addEventListener('DOMContentLoaded', () => {
  new PopupManager()
})